<template>
  <view>
    <view class="goods_list">
      <block v-for="(item,index) in goodsList" :key="index">
        <my-goods :item="item"></my-goods>
      </block>
    </view>
  </view>
</template>

<script>
import {GoodsListData} from '../../service/goodsList_api.js'
import myGoods from '../../components/my-goods.vue'
  export default {
    components:{
      myGoods
    },
    data() {
      return {
        queryOptions:{
          query:'',
          cid:'',
          pagenum:1,
          pagesize:10
        },
        goodsList:[],
        total:0,
        //图片丢失时显示默认图片
        defaultPic:'https://img3.doubanio.com/f/movie/8dd0c794499fe925ae2ae89ee30cd225750457b4/pics/movie/celebrity-default-medium.png',
        //节流处理
        isloading:false
      };
    },
    //接收传来的参数
    async onLoad(options){
      this.queryOptions.query = options.query || ''
      this.queryOptions.cid = options.cid || ''
      //获取商品列表
      this.getGoodsListData()
      
    },
    methods:{
      //获取商品列表数据
      async getGoodsListData(callBack){
        this.isloading = true
        const res = await GoodsListData(this.queryOptions)
        this.isloading = false
        callBack && callBack()
        this.goodsList = [...this.goodsList ,...res.message.goods]
        this.total = res.message.total
      }
    },
    
    //上拉触底增加更多
    onReachBottom(){
      if(this.queryOptions.pagenum * this.queryOptions.pagesize >= this.total) return uni.$showMessage('数据加载完毕')
      //节流控制
      if(this.isloading) return
     this.queryOptions.pagenum++
     this.getGoodsListData()
    },
    
    //下拉刷新
    onPullDownRefresh(){
      this.queryOptions.pagenum = 1
      this.total = 0
      this.isloading = false
      this.goodsList = []
      //传入回调结束下拉刷新
      this.getGoodsListData(()=> uni.stopPullDownRefresh())
    }
  }
</script>

<style lang="scss">
</style>
